//定义组件
var GoBack = React.createClass({
    //1.定义默认属性数据
    getDefaultProps : function () {
        console.log(111,arguments,this);
        return{
            text : '分类网址',
            title : 'leo'
        }
    },
    //2.初始化状态数据
    getInitialState : function () {
        // console.log(this.props);
        // console.log(this.state);
        console.log(222,arguments,this);
        return{
            color : 'red',
            //用属性数据来更新状态数据
            text: this.props.text
        }
    },
    //3.组件即将被构建
    componentWillMount:function () {
        // console.log(this.props);
        // console.log(this.state);
        console.log(333,arguments,this);
    },
    //4.渲染组件
    render : function () {
        // console.log(444,arguments,this);
        //渲染虚拟dom
        return(
            <div className="slider">
                <span className="go-back" onClick={this.goBack}>{this.state.text}</span>
            </div>
        )
    },
    //5.组件构建完成
    componentDidMount : function () {
        // console.log(this.props);
        // console.log(this.state);
        // console.log(ReactDOM.findDOMNode(this));
        console.log(555,arguments,this);

        // 绑定window事件
        window.onscroll=function () {
            // console.log(123);
            //大于200显示返回顶部
            if(window.scrollY>=200){
                //更新状态
                this.setState({text : '返回顶部'})
            }else {
                this.setState({text : '分类网址'})
            }
        }.bind(this);
    },
    //定义事件回调函数
    goBack :function () {
        //将滚动条设置为0
        window.scrollTo(0,0);
    }

});

// 渲染组件
ReactDOM.render(<GoBack title='kevin'/>,app);